import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { InputNumber, Modal, Radio, Form , message } from 'antd';

const FormItem = Form.Item;
const RadioGroup = Radio.Group;
import { axios } from 'utils';

class OverdueOrderUrgeReqList extends Component {
  constructor(props) {
    super(props);
  }

  handleSubmit = (e) => {
    const {  form: { getFieldsValue } } = this.props;
    const { unOrderTotalNum } = this.props;
    const data1 = getFieldsValue();
    const num1 = data1.num;

    const params = JSON.parse(sessionStorage.searchOverdue);

    if(unOrderTotalNum !== 0 && num1 !==0){
        axios({
          url: '/hs/admin/orderOverdue/fastDistribution',
          method: 'post',
          data: {
            ...params,
            overdueOrderUrgeReqList:[
              { 
                num: data1.num,
                collectorId: data1.collectorId
              }
            ]
          }
        }).then(res => {
          
        })
      }else{
        message.warn('输入分配的数量或输入未分配数量为0，不可分配');
        return;
      }
      
      this.props.onCancel();
      this.setState()
  }

  renderRadio = () => {
    const { urgePerson } = this.props;
    return urgePerson.map((item, index) => <Radio value={item.collectorId} key={index} >{item.name}</Radio>)
  }

  render() {
    const formItemLayout = {
      labelCol: {
        span: 6,
      },
      wrapperCol: {
        span: 14,
      }
    };
    const { getFieldDecorator  } = this.props.form;
    const { visible, onCancel, unOrderTotalNum, isOpen } = this.props;

    return (
      <Modal
      title="批量分配订单"
      visible={visible}
      onCancel={onCancel}
      onOk={this.handleSubmit}
      disabled={isOpen}
    >
      <Form>
        <FormItem label="待分配总数量" {...formItemLayout}>
          <div>{unOrderTotalNum}</div>
        </FormItem>

        <FormItem label="需分配数量" {...formItemLayout}>
          {getFieldDecorator('num', {
            rules: [
              {
                required: true, message: '请输入分配的数量！'
              },
            ],
            initialValue: 0
          })(
              <InputNumber  max={unOrderTotalNum} min={0} />
          )}
        </FormItem>

        <FormItem label="选择催收组" {...formItemLayout}>
          {getFieldDecorator('collectorId', {
            initialValue: 1,
            rules: [
              { required: true, message: '未选择催收组！' }
            ],
          })(
            <RadioGroup>
              {this.renderRadio()}
            </RadioGroup>
          )}
        </FormItem>
        
      </Form>
    </Modal>
    )
  }
}


OverdueOrderUrgeReqList.propTypes = {
  urgePerson: PropTypes.array  //催收人
};
OverdueOrderUrgeReqList.defaultProps = {
  urgePerson: []
};
export default Form.create({
  mapPropsToFields(props){
    const { urgePerson } = props;
    const isArr = Array.isArray(urgePerson) && urgePerson.length > 0;
    return {
        person: Form.createFormField({
            value: isArr ? urgePerson[0].value : ''
        }),
        params: Form.createFormField({
          params: props.params
        })
    }
  }
})(OverdueOrderUrgeReqList)